<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>最佳拍档</title>
    <meta name="keywords" content="最佳拍档">
    <meta name="description" content="最佳拍档">
    <style>
        .layui-form-label {
            width: 100px;
        }
        .layui-input-block {
            margin-left: 130px;
        }
    </style>
</head>
<body>
        <!--右侧-->
        <div class="right" style="padding: 20px 20px 0px 20px">
            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
                <legend id="title"></legend>
            </fieldset>
            <form class="layui-form" lay-filter="RecordForm">
                <div class="layui-form-item" id="openeaId_id">
                    <label class="layui-form-label">平台ID</label>
                    <div class="layui-input-block">
                        <input type="text" name="openeaId" placeholder="暂无" autocomplete="off" class="layui-input" readonly>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">公司名</label>
                    <div class="layui-input-block">
                        <input type="text" name="company" placeholder="请填写公司名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">品类</label>
                    <div class="layui-input-inline">
                        <input type="text" name="category" placeholder="请填写品类名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">品牌</label>
                    <div class="layui-input-block">
                        <input type="text" name="brand" placeholder="请填写品牌名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">联系人</label>
                    <div class="layui-input-block">
                        <input type="text" name="contacts" placeholder="请填写联系人名字" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">职务</label>
                    <div class="layui-input-block">
                        <input type="text" name="job" placeholder="请填写职务名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机</label>
                    <div class="layui-input-block">
                        <input type="text" name="telphone" placeholder="请填写手机号码" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">微信</label>
                    <div class="layui-input-block">
                        <input type="text" name="wechatNum" placeholder="请填写微信号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">合作等级</label>
                    <div class="layui-input-block">
                        <input type="text" name="intention" placeholder="请填写合作等级" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <!-- 客户跟进记录时间轴 -->
                <div style="padding-left: 120px;">
                    <ul class="layui-timeline" id="logDataTimeLine"></ul>
                </div>
                <div class="layui-form-item" id="FollowupRecord">
                    <label class="layui-form-label">客户跟进记录</label>
                    <div class="layui-input-block">
                        <textarea name="logData" id="logData" placeholder="请填写客户跟进记录" class="layui-textarea"></textarea>
                    </div>
                </div>
                <div class="layui-form-item" hidden>
                    <label class="layui-form-label">跟进人</label>
                    <div class="layui-input-block">
                        <input type="text" name="authId" placeholder="跟进人" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" id="SubmitBtn" lay-submit lay-filter="submitForm">立即提交</button>
                    </div>
                </div>
            </form>
        </div>
</body>

<script type="text/javascript">

    var logDataJson = []
    let flag = ""

    window.onload=function(){
        let unid = GetQueryString("unid")
        if(isNotNull(unid)){//编辑
            flag = "edit";
            $("#title").text("完善品牌信息");
            initFormData(unid);
        }else{//新增
            flag = "add";
            $("#title").text("添加品牌信息");
            //隐藏不需要填写的字段
            $("#openeaId_id").hide();
            $("#logDataTimeLine").hide();
            $("#FollowupRecord").hide();
        }
        //初始化导航栏选中
        if(GetQueryString("returnurl") == "CollectionBrand"){
            $('a[href="/Admin/Brand/CollectionBrand"]').parent().addClass('layui-this');
            $('a[href="/Admin/Brand/CollectionBrand"]').parent().parent().parent().addClass('layui-nav-itemed');
        }else{
            $('a[href="/Admin/Brand/BrandMerchant"]').parent().addClass('layui-this');
            $('a[href="/Admin/Brand/BrandMerchant"]').parent().parent().parent().addClass('layui-nav-itemed');
        }
    }

    //初始化表单数据
    function initFormData(unid) {
        $.ajax({
            url: '/customer/query',
            type: 'post',
            data: {
                id: unid
            },
            dataType: 'json', // 用于设置响应体的类型 注意 跟 data 参数没关系！！！
            success: function (res) {
                layui.use('form', function(){
                    var form = layui.form;
                    //给表单赋值
                    form.val("RecordForm", {
                        "openeaId": res.data.customer.openeaId
                        ,"company": res.data.customer.company
                        ,"category": res.data.customer.category
                        ,"brand": res.data.customer.brand
                        ,"contacts":res.data.customer.contacts
                        ,"job":res.data.customer.job
                        ,"telphone":res.data.customer.telphone
                        ,"wechatNum":res.data.customer.wechatNum
                        ,"intention":res.data.customer.intention
                        ,"authId": res.data.customer.authId
                    });
                });
                //提交需要用到原始数据
                logDataJson = res.data.logData
                //给客户跟进记录赋值
                $.each(res.data.logData,function(i,item){
                    if(item.edit){
                        $("#logData").val(item.content)
                    }else{
                        $("#logDataTimeLine").append(
                            '<li class="layui-timeline-item"><i class="layui-icon layui-timeline-axis">&#xe63f;</i><div class="layui-timeline-content layui-text"><h3 class="layui-timeline-title">'+item.createTime+'</h3><p>'+item.content+'</p></div></li>'
                        );
                    }
                });
            }
        });
    }

    //表单提交
    layui.use('form', function(){
        var form = layui.form;
        form.on('submit(submitForm)',function (res) {
            let params = {}
            if(flag == "edit"){//编辑
                let originalLog = $("#logData").val();
                let customerLogId = GetQueryString("unid");
                let needAddFlag = true;
                $.each(logDataJson,function(i,item){
                    if(item.edit){
                        item.content = originalLog;
                        needAddFlag = false;
                    }
                    item.customerLogId = item.customerLogId.toString()
                });
                if(needAddFlag){
                    logDataJson = [{customerLogId:customerLogId,content:originalLog.toString(),edit:"true"}];
                }
                let data={
                    "unid": GetQueryString("unid")
                    ,"authId": $('input[name="authId"]').val()
                    ,"openeaId": $('input[name="openeaId"]').val()
                    ,"company": $('input[name="company"]').val()
                    ,"category": $('input[name="category"]').val()
                    ,"brand": $('input[name="brand"]').val()
                    ,"contacts":$('input[name="contacts"]').val()
                    ,"job":$('input[name="job"]').val()
                    ,"telphone":$('input[name="telphone"]').val()
                    ,"wechatNum":$('input[name="wechatNum"]').val()
                    ,"intention":$('input[name="intention"]').val()
                };
                params = {"customer": data,"logData": logDataJson}
            }else if(flag == "add"){//新增
                let data={
                    "company": $('input[name="company"]').val()
                    ,"category": $('input[name="category"]').val()
                    ,"brand": $('input[name="brand"]').val()
                    ,"contacts":$('input[name="contacts"]').val()
                    ,"job":$('input[name="job"]').val()
                    ,"telphone":$('input[name="telphone"]').val()
                    ,"wechatNum":$('input[name="wechatNum"]').val()
                    ,"intention":$('input[name="intention"]').val()
                };
                params = {"customer": data,"logData": []}
            }
            $.ajax({
                type:"post",
                url:'/customer/save',
                data:JSON.stringify(params),
                dataType:'json',
                contentType: 'application/json; charset=UTF-8',
                success:function(req){
                    layui.use('layer', function(){
                        var layer = layui.layer;
                        if(flag == "edit"){
                            layer.msg("更新成功！");
                        }else{
                            layer.msg("新增成功！");
                        }
                    });
                    // 两秒后重载表格数据
                    setTimeout(function(){
                        let return_url = GetQueryString("returnurl");
                        if(isNotNull(return_url)){
                            window.location.href = "http://" + window.location.host + "/Admin/Brand/"+return_url;
                        }else{
                            window.location.href = "http://" + window.location.host + "/Admin/Brand/BrandMerchant";
                        }
                    }, 2000);
                    return false;
                },
                error:function(e){
                    layui.use('layer', function(){
                        var layer = layui.layer;
                        if(flag == "edit"){
                            layer.msg("更新失败！");
                        }else{
                            layer.msg("新增失败！");
                        }
                    });
                }
            })
            return false;
        })
    });
    
</script>

</html>
